{include file="public/head"/}
<link rel="stylesheet" href="__PUBLIC__phone/css/card.css"/>
<body>
<!--头部-->
<header id="headers">
    <div class="container">
        <div class="row">
            <div class="col-xs-12">
                <a href="javascript:;" class="leftRuted glyphicon glyphicon-menu-left pull-left" ></a>
                <p>卡片管理</p>
            </div>
        </div>
    </div>
</header>
<!-- 卡片管理 -->
<div class="shoplist normalBox">
    <div class="container shopwrap">
        <form class="form-inline" action="{:url('/home/Card/index')}" method="post">
            <div class="form-group">
                <div class="inlinebox">
                    <label for="iccd">ICCID</label>
                    <input id="iccd" type="text" value="{$param.iccid|trim}" name="iccid" class="form-control iccd" placeholder="输入ICCID"/>
                </div>
                <div class="inlinebox">
                    <label for="status">状态</label>
                    <select id="status" name="status" class="form-control">
                        <option value="">全部</option>
                        <option value="0" {if condition="$param['status'] eq '0'"} selected {/if} >待测试</option>
                        <option value="1" {if condition="$param['status'] eq '1'"} selected {/if} >库存</option>
                        <option value="2" {if condition="$param['status'] eq '2'"} selected {/if} >待激活</option>
                        <option value="3" {if condition="$param['status'] eq '3'"} selected {/if} >已激活</option>
                        <option value="4" {if condition="$param['status'] eq '4'"} selected {/if} >已停卡</option>
                        <option value="5" {if condition="$param['status'] eq '5'"} selected {/if} >已销卡</option>
                    </select>
                    <span class="caret"></span>
                </div>
                <div class="inlinebox mt5">
                    <label for="spec">规格</label>
                    <input id="spec" type="text" value="{$param.total|trim}" name="total" class="form-control spec" placeholder="套餐规格"/>
                </div>
                <div class="inlinebox mt5">
                    <label for="mno">运营商</label>
                    <select id="mno" name="globalsimtype" class="form-control">
                        <option value="">全部</option>
                        <option value="0" {if condition="$param['globalsimtype'] eq '0'"} selected {/if} >中国联通</option>
                        <option value="1" {if condition="$param['globalsimtype'] eq '1'"} selected {/if}>中国移动</option>
                        <option value="2" {if condition="$param['globalsimtype'] eq '2'"} selected {/if}>中国电信</option>
                    </select>
                    <span class="caret"></span>
                </div>
                <div class="inlinebox mt5">
                    <button class="btn searchbtn" type="submit">
                        <span class="glyphicon glyphicon-search"></span>
                        搜索
                    </button>
                </div>
            </div>
        </form>
        <table class="table-bordered table tablist">
            <tr>
                <th>ICCID</th>
                <th>运营商</th>
                <th>状态</th>
                <th>规格</th>
                <th>已使用量</th>
            </tr>
            {volist name="card.data" id="ca"}
            <tr>
                <td>{$ca.iccid}</td>
                <td>{$ca.globalsimtype}</td>
                <td>{$ca.status}</td>
                <td>{$ca.total}/{$ca.pkg_kind}</td>
                <td>{$ca.pkg_used}</td>
            </tr>
            {/volist}
        </table>
    </div>
</div>
<div class="page">
    <ul id="pageLimit" class="pagination"></ul>
</div>
<script type="text/javascript" src="__PUBLIC__phone/js/bootstrap-paginator.js"></script>
{if condition="$card['last_page'] gt '1'"}
<script>
    $('#pageLimit').bootstrapPaginator({
        currentPage: "<?php echo $card['current_page']; ?>", //当前的请求页面。
        totalPages: "<?php echo $card['last_page']; ?>", //一共多少页。
        size:"small", //应该是页眉的大小。
        bootstrapMajorVersion: 3, //bootstrap的版本要求。
        alignment:"right",
        numberOfPages:3,  //一页列出多少数据。
        itemTexts: function (type, page, current) {   //如下的代码是将页眉显示的中文显示我们自定义的中文。
            switch (type) {
                case "first": return "首页";
                case "prev": return "上一页";
                case "next": return "下一页";
                case "last": return "尾页";
                case "page": return page;
            }
        },
        onPageClicked: function (event, originalEvent, type, page){  //给每个页眉绑定一个事件，其实就是ajax请求，其中page变量为当前点击的页上的数字。
            var search = "<?php echo $search; ?>";
            window.location.href = '/home/Card/index?page='+page+search;
        }
    });
</script>
{/if}
</body>
</html>